
<!--

	//搜索组件-按钮组

		//控制器设置类型
		$search_nav = array(
			'0'=>'全部',
			'1'=>'出售',
			'2'=>'出租',
			'3'=>'求购',
			'4'=>'求租',
		);
		$this->assign('search_nav',$search_nav);

		//视图中引用
		<includexxx file='./Public/Template/Phone/Plugin/plugin_search_nav.html' />
-->


<div  style='margin:10px 0;border:1px solid #ccc;display:flex;cursor:pointer;'>
	<volist name='search_nav' item='key' id='vo'>
		<div class="search_nav" style='flex:1;text-align:center;border-left:1px solid #ccc;border-right:1px solid #ccc' index='{$key}'>{$vo}</div>
	</volist>
</div>

<script>
	$(function(){
		search_nav();
		//按钮组点击事件
		$('.search_nav').click(function(){
			//获取元素属性值并缓存
			sessionStorage.condition_search_nav=$(this).attr('index');
			//选中项的状态保持
			search_nav();	
		});

		//根据缓存设置按钮组样式
		function search_nav(){
			//如果没有缓存按钮项,设置默认下标为0
			if(!sessionStorage.condition_search_nav){
				var SearchNav_Index = 0;
			}else{
				//获取缓存的值
				var SearchNav_Val = sessionStorage.condition_search_nav;
				//遍历按钮
				for(var i=0;i<$('.search_nav').length;i++){
					//获取每个按钮的属性值
					var SearchNav_OptionVal = $('.search_nav').eq(i).attr('index');
					//判断缓存值与按钮属性值，相同就记录按钮的下标
					if(SearchNav_Val == SearchNav_OptionVal){
						var SearchNav_Index = i;
					}
				}
			}
			//设置选项按钮的状态
			$('.search_nav').css('background','').css('color','#000');
			$('.search_nav').eq(SearchNav_Index).css('background','blue').css('color','#fff');
		}
	});

</script>